<template>
  <van-goods-action>
    <van-goods-action-icon
    :icon="isCollected?'star': 'star-o'" 
    :text="isCollected?'已收藏': '未收藏'" 
    :color="isCollected?'#FF8D17': '#333'" 
    @click= "isCollected = !isCollected" />
    <van-goods-action-icon icon="cart-o" text="购物车" :badge="goodsCount" color="#333" @click="toCart"/>
    <van-goods-action-button type="warning" text="加入购物车" @click="addCart"/>
    <van-goods-action-button type="danger" text="立即购买" @click="buyClick"/>
  </van-goods-action>
</template>

<script>
  export default {
    props: ["goodsCount"],
    data(){
      return {
        // 控制sku弹出层的展示
        isCollected: false
      }
    },
    methods: {
      buyClick() {
        this.$toast.fail('功能未开放')
      },
      addCart() {
        this.$emit('addCart')
      },
      // 点击跳转到购物车
      toCart() {
        this.$router.push('/cart')
      }
    }
  }
</script>
<style scoped lang='less'>
  .van-goods-action {
    z-index: 99999;
  }
</style>